<template>
  <div class="research">
    <div style="margin-bottom: 20px">
      <h1>科研情况表</h1>
      <el-tag>学号：{{ studentId }}</el-tag>
    </div>
    <el-form ref="formObj" :model="dynamicData" label-position="right">
      <el-form-item>
        <dynamic :dynamicData='dynamicData' :timestamp='timestamp'
                 @dynamicFormChange="dynamicFormChange"></dynamic>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm()" :loading="loading">提交</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import Dynamic from './StudentResearchDynamic.vue'
import {getStudentInfo, getResearch, submitResearchForm} from "@/api/student";

export default {
  data() {
    return {
      studentId: '',
      dynamicData: {
        domains: [
          {
            type: '',
            time: '',
            name: '',
            content: '',
          },
        ]
      },
      timestamp: '',
      loading: false,
    };
  },
  mounted() {
    getStudentInfo().then((res) => {
      console.log(res.data);
      this.studentId = res.data.studentId;
    });
    getResearch().then((res) => {
      console.log(res.data);
      this.dynamicData.domains = res.data;
    })
  },
  components: {
    Dynamic
  },
  methods: {
    submitForm() {
      //console.log(this.$refs.formObj)
      // console.log(this.dynamicData.domains);
      //console.log(this.dynamicData.domains)
      for (let domain in this.dynamicData.domains) {
        const temp = this.dynamicData.domains[domain]
        if (temp.type === '' || temp.time === '' || temp.name === '' || temp.content === '') {
          this.$message.error("请填写必要的信息！")
          return
        }

      }
      this.timestamp = Date.now().toString();
      this.$nextTick(() => {
        this.$refs['formObj'].validate(valid => {
          console.log(valid)
          if (valid) {
            console.log(this.dynamicData.domains)
            this.loading = true;
            // 传给后端的值
            const params = {
              researchData: this.dynamicData.domains
            }
            submitResearchForm(params).then(res => {
              // console.log(res)
              // console.log(res.message)
              if (res.code === 50003) {
                this.$message.error(res.msg)
              } else {
                this.$message.success(res.msg)
              }
              this.loading = false
            })
          } else {
            //console.log("发生异常");
            this.$message.error("请按正确格式填写表单")
            //this.loading = false;
            return false;
          }
        });
      })
    },
    dynamicFormChange(data) {
      this.formResult = data;
      console.log('子组件传来的值', data)
    }
  }
};
</script>
<style>

.research {
  padding: 20px;
}
</style>
